<template>
  <contentModel
    v-if="showModal"
    title="详情"
    :has-footer="false"
    @close="handleClose"
  >
    <query-page
      :table-render-config="tableComponentConfig"
      :table-render-keys="tableRenderKeys"
      :loading="isLoading"
      :data="renderData"
      :total="total"
      @query-data="getData"
    >
    </query-page>
  </contentModel>
</template>

<script lang="ts" setup>
  import queryPage from '@/common/components/query-page/index.vue';
  import { ref, defineAsyncComponent, onMounted } from 'vue';
  import { pageDetailsList } from '@/api/purchase-order/alterationInquire';
  import { tableComponentConfig, tableRenderKeys } from './dataInfo';

  const contentModel = defineAsyncComponent(
    () => import('@/common/components/content-model/index.vue')
  );
  const total = ref(0);

  const isLoading = ref(true);
  const renderData = ref<any[]>([]);
  const fromInfo = ref({});
  const init = (val) => {
    console.log(val, '列表传递的详情数据');
    fromInfo.value = val;
  };

  const getData = async (queryInfo: object) => {
    renderData.value = [];
    isLoading.value = true;
    console.log('queryInfo添加', queryInfo);
    const params = {
      pmsOrderInfoChangeId: fromInfo.value.id,
    };
    console.log(params, 'params');

    const res = (await pageDetailsList({ params: { ...params } })) as any;
    console.log(res, 'res添加');
    renderData.value = res.data.list;

    try {
      if (res.code === 200) {
        total.value = res.data.total;
        renderData.value = res.data.list;
      }
      // emit('refresh');
    } finally {
      isLoading.value = false;
    }
  };

  onMounted(() => {
    getData();
  });
  const handleClose = () => {
    emit('update:showModal', false);
  };
  defineProps({
    showModal: { type: Boolean, default: false },
  });
  const emit = defineEmits(['refresh', 'update:showModal']);
  // const { pagination, setCurrent, setPageSize, setTotal, queryPagination } =
  //   usePagination();

  // const pageChange = (val: number) => {
  //   setCurrent(val);
  //   getData();
  // };
  // const pageSizeChange = (val: number) => {
  //   setPageSize(val);
  //   getData();
  // };
  // const startNumber = computed(() => {
  //   return queryPagination.value.pageSize * (queryPagination.value.pageNo - 1);
  // });
  defineExpose({ init });
</script>

<style lang="less" scoped>
  .plan-alteration-receive-add-page-container {
    height: calc(100% - 32px);
    padding: 16px 24px;
    background: #fff;
  }
</style>
